import { createElement, serializeLabel } from '../../utils'

export default (expression: any, { metadata }: any) => {
  const { stops } = expression
  return createElement('ul', {
    classes: ['list', 'list--color'],
    content: stops.map(([value, color]: any) =>
      createElement('li', {
        styles: { '--color': color },
        content: serializeLabel(value, metadata),
      })
    ),
  })
}
